<template>
  <div>
    <el-row style="margin-bottom: 30px">
    <el-clo :span="3">
      <button style="border:none;background-color: white;" @click="router.push('/ShowMainPlans')">＜返回</button>
    </el-clo>
   <el-col :span="0.1">
    <span>|</span>
   </el-col>
    <el-clo :span="1">
      <button style="border:none;background-color: white;color:#54a47e"><b>主生产计划</b></button>
    </el-clo>
  </el-row>
  <el-form :inline="true" :model="MainpalanData" class="demo-form-inline">
    <el-form-item label="计划编码" :label-width="MainPlaxsWidth">
      <el-input v-model="MainpalanData.MainplanNum" />
    </el-form-item>
    <el-form-item label="计划名称" :label-width="MainPlaxsWidth">
      <el-input v-model="MainpalanData.MainplanName" />
    </el-form-item>
    <el-form-item label="计划描述" :label-width="MainPlaxsWidth">
      <el-input v-model="MainpalanData.MainplanContext" type="textarea" />
    </el-form-item>
    <el-form-item label="状态" :label-width="MainPlaxsWidth">
      <el-input v-model="MainpalanData.MainplanState" aria-readonly="true" />
    </el-form-item>
    <el-form-item label="制单人" :label-width="MainPlaxsWidth">
      <el-input v-model="MainpalanData.CreateName" />
    </el-form-item>
    <el-form-item label="制单部门" :label-width="MainPlaxsWidth">
      <el-select v-model="MainpalanData.CreateSection" placeholder="请选择" style="width: 170px;">
        <el-option label="技术部" value="技术部" />
      </el-select>
    </el-form-item>
  </el-form>
    <div>
      <el-button style="background-color: #54a47e;color: white;margin-left: 1080px;height: 30px;" @click="MainpalanData.AddNum=1" >保存<img src="../Process/img/image.png" alt=""></el-button>
      <el-button v-if="MainpalanData.AddNum>0" @click="InseerMainPlan">提交</el-button>
    </div>
    <div>
      <H2 style=" color:#50a5f1 ;"><b>所需资源行</b></H2>
      <el-button style="margin-left: 1255px;background-color: #50a5f1;color: white;" v-if="MainpalanData.AddNum>0" @click="dialogFormVisible=true,GetItemInfoData()">新增资源</el-button>
      <el-button style="margin-left: 1255px;background-color:lightgrey;color:dimgray;" @click="ElMessage.error('请先点击保存')" v-if="MainpalanData.AddNum==0">新增资源</el-button>
    </div>
    <div>
      <el-table :data="MainPlansList" style="width: 100%">
        <el-table-column prop="MainplandetailId" label="行号" width="60" />
        <el-table-column prop="SuppliesData" label="物料编码" width="130" />
        <el-table-column prop="SuppliesName" label="物料名称" width="100" />
        <el-table-column prop="Unit" label="单位" width="100" />
        <el-table-column prop="Specification" label="规格" width="100" />
        <el-table-column prop="SuppliesNature" label="物料属性" width="100" />
        <el-table-column prop="BomVersions" label="bom版本" width="100" />
        <el-table-column prop="MainplandetailNum" label="计划数量" width="100" />
        <el-table-column label="开工日期" width="110" >
          <template v-slot="scope">
            {{moment(scope.row.CreateTime).format("YYYY年MM月DD日")}}
          </template>
        </el-table-column>
        <el-table-column label="完工日期" width="110">
          <template v-slot="scope">
            {{moment(scope.row.FinishTime).format("YYYY年MM月DD日")}}
          </template>
        </el-table-column>
        <el-table-column prop="Remark" label="摘要" width="130" />
        <el-table-column label="操作">
          <el-button>编辑</el-button>
          <el-button>删除</el-button>
        </el-table-column>
      </el-table>
    </div>
    <div>
    <el-dialog v-model="dialogFormVisible" title="计划航编辑" width="500">
      <el-form :model="MainplandetailData">
        <el-form-item label="物料选择" :label-width="formLabelWidth">
            <el-select v-model="MainplandetailData.SuppliesData" placeholder="请选择" @change="UpItemInfoData">
              <el-option v-for="item in ItemInfoData" :label="item.itemName" :value="item.itemName" :key="item.inventoryInfoId" />
            </el-select>
          </el-form-item>
          <el-form-item label="物料属性" :label-width="formLabelWidth">
            <el-select v-model="MainplandetailData.SuppliesNature" placeholder="请选择">
              <el-option label="自制" value="自制" />
              <el-option label="采购" value="采购" />
              <el-option label="委外" value="委外" />
            </el-select>
          </el-form-item>
          <el-form-item label="单位" :label-width="formLabelWidth">
            <el-input v-model="MainplandetailData.Unit" autocomplete="off" readonly />
          </el-form-item>
          <el-form-item label="规格" :label-width="formLabelWidth">
            <el-input v-model="MainplandetailData.Specification" autocomplete="off" readonly />
          </el-form-item>
          <el-form-item label="bom版本" :label-width="formLabelWidth">
            <el-select v-model="MainplandetailData.BomVersions" placeholder="请选择">
              <el-option label="最新bom版本" value="最新bom版本" />
              <el-option label="版本abccc" value="版本abccc" />
              <el-option label="版本111" value="版本111" />
              <el-option label="版本v1.0" value="版本v1.0" />
              <el-option label="版本v1.3" value="版本v1.3" />
              <el-option label="版本v2.0" value="版本v2.0" />
            </el-select>
          </el-form-item>
          <el-form-item label="计划数量" :label-width="formLabelWidth">
            <el-input v-model="MainplandetailData.MainplandetailNum" autocomplete="off" />
          </el-form-item>
          <el-form-item label="计划开始日期" :label-width="formLabelWidth">
            <el-date-picker
              v-model="MainplandetailData.CreateTime"
              type="date"
              placeholder="计划开始日期"
              style="width: 100%"
            />
          </el-form-item>
          <el-form-item  label="计划结束日期" :label-width="formLabelWidth">
            <el-date-picker
              v-model="MainplandetailData.FinishTime"
              type="date"
              placeholder="计划结束日期"
              style="width: 100%"
            />
          </el-form-item>
          <el-form-item label="备注" :label-width="formLabelWidth">
            <el-input v-model="MainplandetailData.Remark" autocomplete="off" />
          </el-form-item>
      </el-form>
      <el-button style="margin-left: 330px" @click="dialogFormVisible = false" >返回</el-button>
      <el-button @click="AddMainplandetail">确定</el-button>
    </el-dialog>
    </div>
  </div>
</template>
<script lang="ts" setup>
import { reactive,ref } from 'vue';
import moment from 'moment';
import { useRouter } from 'vue-router';
import axios from 'axios';
import { ElMessage } from 'element-plus';
const ApiUrl=import.meta.env.VITE_APP_API_URL_WAREHOUSE;
const router=useRouter();
const dialogFormVisible = ref(false);
const formLabelWidth = '140px'
const MainPlaxsWidth = '250px'
//主生产计划
const MainpalanData=reactive({
MainplanId :0,
MainplanNum :'',
MainplanName :'',
MainplanContext :'',
MainplanState:'',
CreateName :'',
CreateSection :'',
CreateTime :null,
ApprovalState :false,
IsDelMainplan :false,
AddNum:0
})

//主生产计划明细
const MainplandetailData=reactive({
MainplandetailId :0,
MainplanNum  :'',
ItemCode:'',
SuppliesData  :'',
SuppliesNature  :'',
Unit  :'',
Specification :'',
BomVersions  :'',
MainplandetailNum:'',
CreateTime :'',
FinishTime:null,
Remark  :'',
IsDelMainplandetail:false
})

//审计字段
const EntityData=reactive({
UserLogId:0,
Handle :'张三',
HandleContext :'添加主生产计划',  
HandleTime :new Date,
Pid:1,
IsDelete :false
})

//添加主生产计划明细
const array:any[]=[];
const MainPlansList=ref(array);
const AddMainplandetail=()=>{
  MainplandetailData.ItemCode=ItemInfoData.value.find((x:amu)=>x.itemName==MainplandetailData.SuppliesData).itemCode;
  console.log(MainplandetailData.ItemCode,'123');
  MainplandetailData.MainplandetailId++;
  MainPlansList.value.push({
    MainplandetailId :MainplandetailData.MainplandetailId,
    MainplanNum  :MainpalanData.MainplanNum,
    ItemCode:MainplandetailData.ItemCode,
    SuppliesData  :MainplandetailData.SuppliesData,
    SuppliesNature  :MainplandetailData.SuppliesNature,
    Unit  :MainplandetailData.Unit.toString(),
    Specification :MainplandetailData.Specification,
    BomVersions  :MainplandetailData.BomVersions,
    MainplandetailNum:Number(MainplandetailData.MainplandetailNum),
    CreateTime :MainplandetailData.CreateTime,
    FinishTime:MainplandetailData.FinishTime,
    Remark  :MainplandetailData.Remark,
    IsDelMainplandetail:MainplandetailData.IsDelMainplandetail,
    Handle :EntityData.Handle,
    HandleContext :EntityData.HandleContext,  
    HandleTime :new Date(),
    Pid:EntityData.Pid,
    IsDelete :EntityData.IsDelete
  })
  console.log(MainPlansList);
}

//获取物料表数据
const ItemInfoData:any=ref([]);
const GetItemInfoData=()=>{
  console.log(ApiUrl);
axios.get(ApiUrl+"/api/MainPlan/GetItemInfoData").then(res=>{
  ItemInfoData.value=res.data.data;
  console.log(res.data.code);
})
}

//反填所选择的的物料数据
const UpItemInfoData=()=>{
  console.log('1313');
  const IteminfoData_=ItemInfoData.value.find((x:any)=>x.itemName==MainplandetailData.SuppliesData);
  MainplandetailData.Unit=IteminfoData_.specsUnitId;
  MainplandetailData.Specification=IteminfoData_.specName;
}

//添加主生产计划
const InseerMainPlan=()=>{
  let MainplanState_=0;
  if(MainpalanData.MainplanState=="新建")
  { 
    MainplanState_=1;
  }
  else if(MainpalanData.MainplanState=="确认")
  {
    MainplanState_=2;
  }
  else
  {
    MainplanState_=3;
  }
  axios.post(ApiUrl+"/api/MainPlan/AddMainplanData",{
    MainplanId :MainpalanData.MainplanId,
    MainplanNum :MainpalanData.MainplanNum,
    MainplanName :MainpalanData.MainplanName,
    MainplanContext :MainpalanData.MainplanContext,
    MainplanState:MainplanState_,
    CreateName :MainpalanData.CreateName,
    CreateSection :MainpalanData.CreateSection,
    CreateTime :new Date(),
    ApprovalState :MainpalanData.ApprovalState,
    IsDelMainplan :MainpalanData.IsDelMainplan,
    Handle :EntityData.Handle,
    HandleContext :EntityData.HandleContext,  
    HandleTime :new Date(),
    Pid:EntityData.Pid,
    IsDelete :EntityData.IsDelete,
    mainplandetails:MainPlansList.value
  }).then(res=>{
    if(res.data.code>0)
    {
      AddUserLogData();
    }
    else
    {
      ElMessage.error('添加失败');
    }
})
}

//添加用户行为日志
const AddUserLogData=()=>{
  axios.post(ApiUrl+"/api/UserLog/AddUserLogData",{
  UserLogId :EntityData.UserLogId,
  Handle :EntityData.Handle,
  HandleContext:EntityData.HandleContext,
  Pid :EntityData.Pid,
  IsDelete:EntityData.IsDelete
  }).then(res=>{
    if(res.data.code>0)
    {
      ElMessage.success('添加成功');
    }
    else
    {
      ElMessage.error('添加失败');
    }
  })
}


</script>